<script setup>
import NavBar from "@/components/NavBar.vue";
import {reactive, ref} from "vue";
import {AddressEdit, showToast} from 'vant';
import 'vant/lib/index.css';
import area from '@/assets/area'
import {useRouter} from "vue-router";
import {infoStore} from "@/stores";

const store = infoStore()
const {insertAddressList} = store
const userRouter = useRouter()
const state = reactive({
    title: '新建地址',
    address: {
        id: 3,
        customerName: '',
        phone: '',
        defaultAddress: false,
        fullAddress: ''
    }
})
const areaList = area
const searchResult = ref([]);

const onSave = (item) => {
    console.log(item)
    state.address.customerName = item.name
    state.address.phone = item.tel
    state.address.defaultAddress = item.isDefault
    state.address.fullAddress = item.city + item.county + item.province + item.addressDetail
    insertAddressList(state.address)
    showToast('添加成功')
    userRouter.back()
};
const onDelete = () => {
    userRouter.back()
    showToast('delete')
};

</script>

<template>
    <NavBar :title="state.title"/>
    <AddressEdit
        :area-list="areaList"
        show-delete
        show-set-default
        show-search-result
        :search-result="searchResult"
        :area-columns-placeholder="['请选择', '请选择', '请选择']"
        @save="onSave"
        @delete="onDelete"
    />
</template>

<style scoped lang="less">

</style>